<template>
  <div class="title">
    <div class="title_top">消息通知</div>
    <div v-if="todoList.length > 0" class="title_list">
      <div v-for="(item, index) in todoList" :key="index" class="title_item">
        <!-- 通知 -->
        <div class="title_item_left cursor_pointer beyond_hiding" @click="toExecute(item)">
          <a-popover placement="topLeft">
            <template slot="content">
              <span>{{ item.content }}</span>
            </template>
            {{ item.content }}
          </a-popover>
        </div>
        <!-- 时间 -->
        <div class="title_item_right" v-text="item.createtime.substring(0, 10)"></div>
      </div>
    </div>
    <a-empty v-else />
  </div>
</template>
<script>
import { getByUserid } from '@/api/arrive/apl_arrive_details.js'
import { getReviewById } from '@/api/accept/apl_admreview'
import { APP_USER } from '@/store/mutation-types.js'
import storage from 'store'
import moment from 'moment'
export default {
  name: 'left_top',
  data () {
    return {
      todoList: [], // 代办通知列表
      currentUser: storage.get(APP_USER) // 登录人信息
    }
  },
  created () {
    this.queryTodoNotice()
  },
  methods: {
    // 处理通知任务
    async toExecute (record) {
      console.log('record', record)
      const applyid = record.applyid
      // 查询当前案件的基本信息
      const res = await getReviewById(applyid)
      if (res.code == 0) {
        const result = res.data
        record.status = result.status
        record.status_text = result.status_text
        if (record.warntime) {
          record.leftDay = moment(record.warntime).diff(moment(new Date()), 'days')
        } else {
          record.leftDay = undefined
        }
        this.$router.push({
          path: `/ArriveInfoAdd/${applyid}`,
          query: {
            url: '/ArriveInfo',
            queryParam: record
          }
        })
      } else {
        this.$message.error('获取基本信息失败')
      }
    },
    async queryTodoNotice () {
      const { data } = await getByUserid(this.currentUser.userId)
      // console.log('待处理的通知', data)
      this.todoList = data || []
    }
  }
}
</script>

<style lang="less" scoped>
::v-deep .ant-empty {
  height: 240px;
}
::v-deep .ant-empty-image {
  margin-top: 70px;
}
.title {
  display: flex;
  flex-direction: column;
  // overflow: auto;
  .title_top {
    // margin-top: 30px;
    padding-bottom: 16px;
    border-bottom: 3px solid #f5f5f5;
    font-size: 23px;
    font-family: PingFang SC;
    font-weight: 800;
    color: #2c2c2c;
  }
  .title_list {
    max-height: 240px;
    overflow: auto;
    width: 100%;
  }
  .title_item {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 20px 0;
    border-bottom: 1px solid #f5f5f5;
    .title_item_left {
      font-size: 16px;
      font-family: PingFang SC;
      font-weight: 500;
      color: #2c2c2c;
      width: 80%;
    }
    .title_item_left:hover {
      color: #1890ff;
    }
    .title_item_right {
      font-size: 16px;
      font-family: PingFang SC;
      font-weight: 500;
      color: #696969;
      width: 20%;
      direction: rtl;
      padding-right: 15px;
      min-width: 120px;
    }
  }
}
</style>
